<template>
  <view class="service">
    <uni-icons type="phone-filled" :size="30" color="#aa0000" />
    <view class="right">
      <h3>客服热线</h3>
      <view v-if="platform === 'h5'">
        <a :href="'tel:' + phoneNumber" class="phone-link">{{ phoneNumber }}</a>
      </view>
      <view v-else>
        <text @click="makePhoneCall" style="font-size: 20px;">{{ phoneNumber }}</text>
      </view>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      phoneNumber: '18877138395', 
      platform: uni.getSystemInfoSync().platform // 获取当前平台信息
    };
  },
  methods: {
    makePhoneCall() {
      uni.makePhoneCall({
        phoneNumber: this.phoneNumber,
        success: function () {
          console.log('拨打电话成功！');
        },
        fail: function () {
          console.log('拨打电话失败！');
        }
      });
    }
  }
};
</script>

<style scoped>
.service {
  display: flex;
  align-items: center;
  padding: 10px;
  border-bottom: 1px solid #ccc;
}

.right {
  margin-left: 10px;
}

.phone-link {
  color: #007aff;
  text-decoration: none;
}
</style>